import React, {Component} from 'react';
import {View, Text, StatusBar, TextInput, ToastAndroid, Button} from 'react-native';
import Colors from '../values/Colors';
import HttpUtil from '../utils/HttpUtil';

export default class Login extends Component {

    constructor(props) {
        super(props);
        this.registered = this.props.navigation.getParam('registered');
        this.state = {
            registered: this.registered,
        };
    }


    componentDidMount() {
        this._navListener = this.props.navigation.addListener('didFocus', () => {
            console.log('Recommend didFocus ');
            this.setState({
                registered: this.registered,
            });
        });
    }

    componentWillUnmount() {
    }

    render() {
        return (
            <>
                <StatusBar
                    barStyle={'light-content'}
                    backgroundColor={Colors.colorPrimary}
                    translucent={false}
                />
                <View style={{flex: 1, paddingHorizontal: 15, paddingVertical: 15, fontSize: 16}}>
                    <Text style={{fontSize: 24, textAlign: 'center', color: Colors.colorLight}}>
                        {this.state.registered ? '注册' : '登录'}
                    </Text>
                    <View style={{flexDirection: 'row'}}>
                        <Text style={{textAlignVertical: 'center', fontSize: 16}}>用户名</Text>
                        <TextInput
                            style={{marginLeft: 10, fontSize: 16}}
                            placeholder={'用户名'}
                            onChangeText={value => (this.username = value)}
                        />
                    </View>

                    <View style={{flexDirection: 'row'}}>
                        <Text style={{textAlignVertical: 'center', fontSize: 16}}>密&nbsp;&nbsp;&nbsp;码</Text>
                        <TextInput
                            style={{marginLeft: 10, fontSize: 16}}
                            placeholder={'密 码'}
                            onChangeText={value => (this.password = value)}
                        />
                    </View>

                    {!this.state.registered && <View style={{paddingVertical: 15}}>
                        <Text
                            style={{color: 'blue', textDecorationLine: 'underline', textAlign: 'center'}}
                            onPress={() => {
                                this.props.navigation.push('Register', {registered: true});
                                this.setState({
                                    registered: true,
                                });
                            }}>立即注册</Text>
                    </View>}

                    <View style={{paddingVertical: 20}}>
                        <Button title={'确定'}
                                onPress={() => {
                                    if (this.state.registered) {
                                        console.log('注册');
                                        HttpUtil.post('http://47.95.206.134:8009/admin/user', {
                                            username: this.username,
                                            password: this.password,
                                        }).then(r => {
                                            if (r) {
                                                this.props.navigation.replace('Home');
                                            }

                                        }).catch(v => {
                                            console.log(v);
                                        });
                                    } else {
                                        console.log('登录');
                                        HttpUtil.post('http://47.95.206.134:8009/admin/user/login', {
                                            username: this.username,
                                            password: this.password,
                                        }).then(r => {
                                            if (r) {
                                                this.props.navigation.replace('Home');
                                            } else {
                                                ToastAndroid.show('用户名或密码错误！', ToastAndroid.SHORT);
                                            }
                                        }).catch(v=>{
                                            console.log(v);
                                            ToastAndroid.show('用户名或密码错误！', ToastAndroid.SHORT);
                                        });
                                    }


                                }}/>
                    </View>


                </View>
            </>

        )
            ;
    }
}
